<template>
  <div class="container">
    <el-tabs v-model="activeName" @tab-click="handleClick">
      <el-tab-pane label="账户余额" name="balance">
        <balance v-if="activeName == 'balance'"></balance>
      </el-tab-pane>
      <el-tab-pane label="账户明细" name="detail">
        <detail v-if="activeName == 'detail'"></detail>
      </el-tab-pane>
      <el-tab-pane label="线下收支" name="offlineIncome">
        <offlineIncome v-if="activeName == 'offlineIncome'"></offlineIncome>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
import balance from "./components/balance";
import detail from "./components/detail";
import offlineIncome from "./components/offlineIncome";
export default {
  name: "income",
  components: {
    balance,
    detail,
    offlineIncome,
  },
  data() {
    return { activeName: "balance" };
  },
  mounted() {},
  watch: {},
  methods: {},
};
</script>

<style scoped lang='scss'>
.container {
  /deep/.el-tabs__header {
    margin-left: 10px;
  }
}
</style>